let routes = [{
    path: "/",
    component: {
      template: "<div>home</div>"
    }
  },
  {
    path: "/about",
    component: {
      template: "<div>about</div>"
    }
  },
  {
    path: "/message/:id",
    component: {
      template: `
      <div>
        message{{$route.params.id}}
        <br>
        <router-link to="/message/123/white">白猫的消息</router-link>
        <router-link to="/message/123/black">黑猫的消息</router-link>
        <router-view></router-view>
      </div>`,
    },
    children: [
      {
        path: "",
        component: {
          template: "<div>默认</div>"
        }
      },
      {
        path: "white",
        name:"白猫",
        component: {
          template: "<div>白猫</div>"
        }
      },
      {
        path: "black",
        component: {
          template: "<div>黑猫</div>"
        }
      }
    ]
  },
  {
    path: "/user",
    component: {
      template: "<div>user{{$route.query.q}}</div>",
      beforeRouteUpdate(to, from, next) {
        console.log(to, from);
        next();
      },
    }
  },
  {
    path: "*",
    component: {
      template: "<div @click='resetRouteHandle'>没有找到该资源</div>",
      methods: {
        resetRouteHandle() {
          this.$router.push("/");
        }
      }
    }
  }
];
export {
  routes
}